<!-- App.vue -->
<template>
  <v-app>
    <v-navigation-drawer app>
      <v-card height="100%">
        <v-divider></v-divider>
        <v-list dense nav>
          <v-list-item v-for="item in items" :key="item.title" link>
            <v-list-item-icon>
              <v-icon>{{ item.icon }}</v-icon>
            </v-list-item-icon>

            <v-list-item-content>
              <v-list-item-title>{{ item.title }}</v-list-item-title>
            </v-list-item-content>
          </v-list-item>
        </v-list>
      </v-card>
    </v-navigation-drawer>
    <!-- -->

    <v-app-bar app color="#fff" floating>
      <v-app-bar-title>易快通企业管理咨询</v-app-bar-title>
    </v-app-bar>

    <!-- 根据应用组件来调整你的内容 -->
    <v-main>

      <!-- 给应用提供合适的间距 -->
      <v-container fluid>
        <v-simple-table>
          <template v-slot:default>
            <thead>
            <tr>
              <th class="text-left">
                id
              </th>
              <th class="text-left">
                小区
              </th>
              <th class="text-left">
                姓名
              </th>
              <th class="text-left">
                电话号码
              </th>
              <th class="text-left">
                详细地址
              </th>
              <th class="text-left">
                数量
              </th>
              <th class="text-left">
                下单时间
              </th>
              <th class="text-left">
                完成时间
              </th>
              <th class="text-left">
                送货人
              </th>
            </tr>
            </thead>
            <tbody>
            <tr v-for="item in orders" :key="item.id">
              <td>{{ item.id }}</td>
              <td>{{ item.community }}</td>
              <td>{{ item.name }}</td>
              <td>{{ item.phone }}</td>
              <td>{{ item.address }}</td>
              <td>{{ item.amount }}</td>
              <td>{{ item.createTime }}</td>
              <td>{{ item.completeTime == null ? '未完成' : item.completeTime }}</td>
              <td>{{ item.completeUserName }}</td>
            </tr>
            </tbody>
          </template>
        </v-simple-table>
        <!--        <v-carousel cycle height="1200" hide-delimiter-background show-arrows-on-hover>
                  <v-carousel-item v-for="(slide, i) in slides" :key="i">
                    <v-sheet :color="colors[i]" height="100%">
                      <v-row class="fill-height" align="center" justify="center">
                        <div class="text-h2">
                          {{ slide }} Slide
                        </div>
                      </v-row>
                    </v-sheet>
                  </v-carousel-item>
                </v-carousel>-->
      </v-container>
    </v-main>
  </v-app>
</template>
<script>
export default {
  name: 'Home',
  data: () => ({
        items: [
          {title: '订单', icon: 'mdi-view-dashboard'},
          {title: '税务', icon: 'mdi-image'},
          {title: '工商', icon: 'mdi-help-box'},
        ],
        colors: [
          'indigo',
          'warning',
          'pink darken-2',
          'red lighten-1',
          'deep-purple accent-4',
        ],
        slides: [
          'First',
          'Second',
          'Third',
          'Fourth',
          'Fifth',
        ],
        orders: []
      }
  ),
  methods: {
    async getOrderList() {
      let that = this
      that.$axios({
        method: 'post',
        url: this.global.order_server_url + '/order/all',
        headers: {'Content-Type': 'application/json'},
        data: JSON.stringify(this.order)
      }).then((response) => {
        let code = response.data.code
        if (code == 200) {
          console.log(response.data.data)
          this.orders = response.data.data
        } else {
          console.log(response.data)
        }
        //请求成功返回的数据
      }).catch((error) => {
        console.log(error)
      })
    }
  }, mounted() {
    this.getOrderList()
  }

}
</script>
<style scoped>

</style>